<section class="starry-sky">
  <div class="stars"></div>
  <div class="twinkling"></div>
  <div class="clouds"></div>
  <div class="logo"></div>
</section>
<section class="plugins">
  <div class="main">
    <h1 class="ng-nest">NG-NEST</h1>
    <p class="open-source">完全开源</p>
    <p class="web-application">Web应用程序框架</p>
    <p class="angular-nest">基于 Angular 和 Nest</p>
    <p class="description">
      NG-NEST 是一个完整的框架，提供强大的基础设施来构建现代的 Web 应用程序，遵循最佳实践和约定，为您提供可靠的开发经验。
    </p>
    <p class="code-start">
      <a>源代码</a>
      <a>开始使用</a>
    </p>
  </div>
  <div class="data"></div>
</section>
<section class="nav">
  <ul>
    <li><x-button type="text" size="big">架构</x-button></li>
    <li><x-button type="text" size="big">基础设施</x-button></li>
    <li><x-button type="text" size="big">模块化</x-button></li>
    <li><x-button type="text" size="big">关注点</x-button></li>
    <li><x-button type="text" size="big">简化</x-button></li>
  </ul>
</section>
<section class="content">
  <div class="panel">
    <div class="box">
      <img src="assets/img/module.png" />
      <h1>完整的架构</h1>
      <p>包含前后台的解决方案。</p>
    </div>
    <div class="slides">
      <div class="slide">
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
      </div>
      <div class="slide">
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
      </div>
      <div class="slide">
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
      </div>
      <div class="slide">
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
        <div class="item">
          <img src="assets/img/module.png" />
          <h3>架构</h3>
          <p>包含前后台的解决方案。</p>
        </div>
      </div>
    </div>
  </div>
  <div class="panel">
    <div class="box">
      <img />
      <h1>基础设施</h1>
      <p>大量构建应用程序的基础设施。</p>
    </div>
  </div>
  <div class="panel">
    <div class="box">
      <img />
      <h1><span>强大的</span><br />模块化系统</h1>
      <p>提供了完整的模块化系统，允许您开发可重用的应用程序模块。</p>
    </div>
  </div>
  <div class="panel">
    <div class="box">
      <img />
      <h1>关注点</h1>
      <p>始终聚焦于实际的业务，业务驱动开发。</p>
    </div>
  </div>
  <div class="panel">
    <div class="box">
      <img />
      <h1>简化</h1>
      <p>NG-NEST 是为开发人员准备的，它旨在简化您的日常软件开发。</p>
    </div>
  </div>
</section>
